<template>
 <u-multi-layout
    direction="vertical"
    style="height: 100vh; font-family: var(--font-family-zh-CN)">
    <u-multi-layout-item style="height: 60px;">
      <u-navbar-multi
        value="1"
        :router="false"
        class="app-nav-bar"
      >
        <template #right>
          <u-multi-layout-item alignItems="center" justify="end">
            <u-dropdown style="margin-right: 10px">
              <template #default>
                <u-dropdown-item>
                  <u-text text="安全退出"></u-text>
                </u-dropdown-item>
              </template>
              <template #title>
                <AvatarDefault class="user-avatar" />
                <span class="user-name">
                  <u-text text="USERNAME"></u-text>
                </span>
              </template>
            </u-dropdown>
          </u-multi-layout-item>
        </template>
        <template #left>
          <u-multi-layout-item align-items="center" style="width: 200px">
            <svg width="32" height="32" viewBox="0 0 32 32" class="app-logo" fill="none" xmlns="http://www.w3.org/2000/svg">
              <g clip-path="url(#clip0_3573_36558)">
                <path fill-rule="evenodd" clip-rule="evenodd" d="M26.1377 5.85517C26.4489 6.03492 26.4406 6.48696 26.123 6.65508L22.3077 8.67438C22.1686 8.74799 22.0015 8.74489 21.8653 8.6662L16.2287 5.41079C16.0872 5.32909 15.9129 5.32908 15.7714 5.41075L10.1327 8.6663C9.99648 8.74495 9.82939 8.74803 9.69036 8.67447L5.87367 6.65513C5.55595 6.48703 5.54759 6.03489 5.85888 5.85515L15.7714 0.132122C15.9129 0.0504495 16.0872 0.0504628 16.2287 0.132158L26.1377 5.85517ZM25.0532 21.4927C25.1946 21.4111 25.2817 21.2601 25.2817 21.0969V10.9033C25.2817 10.74 25.3688 10.5891 25.5102 10.5074L29.1657 8.39617C29.4705 8.22016 29.8516 8.44009 29.8516 8.79203V23.7363C29.8516 23.8995 29.7644 24.0504 29.623 24.132L16.2287 31.868C16.0872 31.9497 15.9129 31.9497 15.7714 31.8681L2.37228 24.132C2.23084 24.0504 2.14371 23.8995 2.14371 23.7361V8.79191C2.14371 8.44 2.52467 8.22006 2.82942 8.39601L6.48656 10.5075C6.62801 10.5891 6.71514 10.74 6.71514 10.9034V21.0968C6.71514 21.2601 6.80227 21.4111 6.94371 21.4927L15.7714 26.5894C15.9129 26.6711 16.0872 26.6711 16.2287 26.5894L25.0532 21.4927ZM12.3442 11.151C12.4823 11.0762 12.649 11.0776 12.7858 11.1545L15.7956 12.8462C15.9354 12.9248 16.1063 12.9244 16.2457 12.8449L19.313 11.099C19.4541 11.0187 19.6271 11.0192 19.7677 11.1004L21.5496 12.1292C21.6949 12.2131 21.7825 12.3699 21.778 12.5376L21.7213 14.6052C21.7169 14.7621 21.6325 14.9059 21.4974 14.9859L18.4958 16.7654C18.3577 16.8471 18.2727 16.9953 18.2718 17.1558L18.2464 21.2992C18.2454 21.4615 18.1584 21.6112 18.0178 21.6924L16.2359 22.7211C16.0906 22.8051 15.911 22.8025 15.768 22.7147L14.0058 21.6318C13.872 21.5496 13.7898 21.4046 13.788 21.2476L13.7407 17.1371C13.7388 16.9766 13.6529 16.8288 13.5145 16.7478L10.512 14.9897C10.3719 14.9077 10.2858 14.7575 10.2858 14.5952V12.5376C10.2858 12.3699 10.3778 12.2156 10.5253 12.1357L12.3442 11.151Z" fill="currentColor"/>
              </g>
              <defs>
              <clipPath id="clip0_3573_36558">
                <rect width="32" height="32" fill="white"/>
              </clipPath>
              </defs>
            </svg>

            <u-text
              size="large"
              text="应用名称"
              class="app-title"
              style="--custom-start: auto; vertical-align: middle"></u-text>
          </u-multi-layout-item>
        </template>
        <u-navbar-item-multi value="1" class="app-nav-bar-item">
          <u-text text="顶部导航1"></u-text>
        </u-navbar-item-multi>
        <u-navbar-item-multi value="2" class="app-nav-bar-item">
          <u-text text="顶部导航2"></u-text>
        </u-navbar-item-multi>
        <u-navbar-item-multi value="3" class="app-nav-bar-item">
          <u-text text="顶部导航3"></u-text>
        </u-navbar-item-multi>
      </u-navbar-multi>
    </u-multi-layout-item>
    <u-multi-layout-item>
      <u-multi-layout>
        <u-multi-layout-item style="width: 200px">
          <u-sidebar
            :router="false"
            value="dashboard"
            class="app-side-bar"
          >
            <u-sidebar-item value="dashboard" class="app-side-bar-item">
              <svg width="18" height="18" viewBox="0 0 18 18" fill="none" class="app-side-bar-item-icon" xmlns="http://www.w3.org/2000/svg">
                <path d="M10.7266 2.17151L16.1171 5.75088C17.0108 6.34429 17.0108 7.65669 16.1171 8.25009L10.7266 11.8295C9.72094 12.4972 8.413 12.4972 7.40742 11.8293L2.01777 8.25002C1.12427 7.65661 1.12427 6.34436 2.01777 5.75096L7.40742 2.17164C8.413 1.50378 9.72094 1.50374 10.7266 2.17151ZM15.3874 7.00049C15.3874 6.96473 15.3725 6.93696 15.3427 6.91718L9.95216 3.3378C9.36207 2.94598 8.77199 2.946 8.18192 3.33786L2.79226 6.91719C2.76252 6.93694 2.74767 6.96471 2.74771 7.00049C2.74767 7.03627 2.76254 7.06406 2.79233 7.08386L8.18192 10.6631C8.77199 11.055 9.36207 11.055 9.95216 10.6632L15.3427 7.08379C15.3725 7.06401 15.3874 7.03624 15.3874 7.00049Z" fill="currentColor"/>
                <path d="M10.7793 15.8094L16.3874 12.0826C16.4262 12.0568 16.4622 12.0274 16.4951 11.9945C16.5276 11.962 16.5566 11.9266 16.5821 11.8884C16.6077 11.8502 16.6292 11.8099 16.6468 11.7674C16.6644 11.7249 16.6777 11.6812 16.6867 11.6361C16.6956 11.591 16.7001 11.5455 16.7001 11.4995C16.7001 11.4535 16.6956 11.408 16.6867 11.3629C16.6777 11.3179 16.6644 11.2741 16.6468 11.2316C16.6292 11.1892 16.6077 11.1488 16.5821 11.1106C16.5566 11.0724 16.5276 11.037 16.4951 11.0045C16.4667 10.9762 16.4361 10.9504 16.4034 10.9273C16.3706 10.9042 16.336 10.8841 16.2998 10.8669C16.2635 10.8497 16.2261 10.8358 16.1874 10.825C16.1488 10.8143 16.1095 10.807 16.0696 10.803C16.0297 10.799 15.9897 10.7984 15.9497 10.8013C15.9097 10.8042 15.8702 10.8105 15.8313 10.8202C15.7924 10.8298 15.7546 10.8428 15.7179 10.8589C15.6811 10.8751 15.6459 10.8944 15.6125 10.9166L10.0045 14.6434C9.34108 15.0842 8.67747 15.0846 8.01361 14.6445L2.38802 10.915C2.35463 10.8929 2.31959 10.8738 2.2829 10.8576C2.24622 10.8415 2.20843 10.8286 2.16951 10.819C2.1306 10.8094 2.09116 10.8031 2.0512 10.8003C2.01119 10.7974 1.97126 10.798 1.9314 10.802C1.8915 10.806 1.85226 10.8133 1.81368 10.8241C1.77504 10.8348 1.73762 10.8488 1.70141 10.866C1.66519 10.8831 1.63069 10.9033 1.59791 10.9263C1.56517 10.9494 1.53464 10.9752 1.5063 11.0035C1.4738 11.036 1.44477 11.0714 1.41921 11.1095C1.39371 11.1478 1.37217 11.1881 1.35458 11.2306C1.337 11.2731 1.32373 11.3168 1.31478 11.3619C1.30577 11.407 1.30127 11.4525 1.30127 11.4985C1.30127 11.5445 1.30575 11.59 1.31471 11.6351C1.32366 11.6801 1.33693 11.7239 1.35451 11.7664C1.37215 11.8088 1.39371 11.8491 1.41922 11.8874C1.44478 11.9256 1.47382 11.9609 1.50632 11.9934C1.53943 12.0265 1.57548 12.056 1.61448 12.0819L7.24003 15.8114C7.77643 16.167 8.36641 16.3446 9.00997 16.3442C9.65353 16.3439 10.2433 16.1656 10.7793 15.8094Z" fill="currentColor" />
              </svg>
              <u-text text="总览页" class="app-side-bar-item-text"></u-text>
            </u-sidebar-item>
            <u-sidebar-item value="form" class="app-side-bar-item">
              <svg width="18" height="18" viewBox="0 0 18 18" fill="none" class="app-side-bar-item-icon" xmlns="http://www.w3.org/2000/svg">
                <path d="M5.00098 1.5C3.34413 1.5 2.00098 2.84315 2.00098 4.5V13.5C2.00098 15.1569 3.34413 16.5 5.00098 16.5H8.03467L9.43467 15.1H5.00098C4.55915 15.1 4.18203 14.9438 3.86961 14.6314C3.55719 14.3189 3.40098 13.9418 3.40098 13.5V4.5C3.40098 4.05817 3.55719 3.68105 3.86961 3.36863C4.18203 3.05621 4.55915 2.9 5.00098 2.9H13.001C13.4428 2.9 13.8199 3.05621 14.1324 3.36863C14.4448 3.68105 14.601 4.05817 14.601 4.5V9.93369L16.001 8.53369V4.5C16.001 2.84315 14.6579 1.5 13.001 1.5H5.00098Z" fill="currentColor"/>
                <path d="M12 5.7998H5.99999C5.95402 5.7998 5.9085 5.80429 5.86342 5.81325C5.81835 5.82222 5.77457 5.8355 5.73211 5.85309C5.68965 5.87068 5.64931 5.89224 5.61109 5.91778C5.57287 5.94331 5.53751 5.97233 5.50501 6.00483C5.47251 6.03733 5.44349 6.07269 5.41796 6.11091C5.39242 6.14912 5.37086 6.18946 5.35327 6.23193C5.33568 6.27439 5.3224 6.31816 5.31344 6.36324C5.30447 6.40832 5.29999 6.45384 5.29999 6.4998C5.29999 6.54577 5.30447 6.59129 5.31344 6.63637C5.3224 6.68145 5.33568 6.72522 5.35327 6.76768C5.37086 6.81015 5.39242 6.85049 5.41796 6.8887C5.44349 6.92692 5.47251 6.96228 5.50501 6.99478C5.53751 7.02728 5.57287 7.0563 5.61109 7.08183C5.64931 7.10737 5.68965 7.12893 5.73211 7.14652C5.77457 7.16411 5.81835 7.17739 5.86342 7.18635C5.9085 7.19532 5.95402 7.1998 5.99999 7.1998H12C12.0459 7.1998 12.0915 7.19532 12.1365 7.18635C12.1816 7.17739 12.2254 7.16411 12.2679 7.14652C12.3103 7.12893 12.3507 7.10737 12.3889 7.08183C12.4271 7.0563 12.4625 7.02728 12.495 6.99478C12.5275 6.96228 12.5565 6.92692 12.582 6.8887C12.6076 6.85049 12.6291 6.81015 12.6467 6.76768C12.6643 6.72522 12.6776 6.68145 12.6865 6.63637C12.6955 6.59129 12.7 6.54577 12.7 6.4998C12.7 6.45384 12.6955 6.40832 12.6865 6.36324C12.6776 6.31816 12.6643 6.27439 12.6467 6.23193C12.6291 6.18946 12.6076 6.14912 12.582 6.11091C12.5565 6.07269 12.5275 6.03733 12.495 6.00483C12.4625 5.97233 12.4271 5.94331 12.3889 5.91778C12.3507 5.89224 12.3103 5.87068 12.2679 5.85309C12.2254 5.8355 12.1816 5.82222 12.1365 5.81325C12.0915 5.80429 12.0459 5.7998 12 5.7998Z" fill="currentColor"/>
                <path d="M5.99999 8.7998H9.99999C10.0459 8.7998 10.0915 8.80429 10.1365 8.81325C10.1816 8.82222 10.2254 8.8355 10.2679 8.85309C10.3103 8.87068 10.3507 8.89224 10.3889 8.91778C10.4271 8.94331 10.4625 8.97233 10.495 9.00483C10.5275 9.03733 10.5565 9.07269 10.582 9.11091C10.6076 9.14912 10.6291 9.18946 10.6467 9.23193C10.6643 9.27439 10.6776 9.31816 10.6865 9.36324C10.6955 9.40832 10.7 9.45384 10.7 9.4998C10.7 9.54577 10.6955 9.59129 10.6865 9.63637C10.6776 9.68145 10.6643 9.72522 10.6467 9.76768C10.6291 9.81015 10.6076 9.85049 10.582 9.8887C10.5565 9.92692 10.5275 9.96228 10.495 9.99478C10.4625 10.0273 10.4271 10.0563 10.3889 10.0818C10.3507 10.1074 10.3103 10.1289 10.2679 10.1465C10.2254 10.1641 10.1816 10.1774 10.1365 10.1864C10.0915 10.1953 10.0459 10.1998 9.99999 10.1998H5.99999C5.95402 10.1998 5.9085 10.1953 5.86342 10.1864C5.81835 10.1774 5.77457 10.1641 5.73211 10.1465C5.68965 10.1289 5.64931 10.1074 5.61109 10.0818C5.57287 10.0563 5.53751 10.0273 5.50501 9.99478C5.47251 9.96228 5.44349 9.92692 5.41796 9.8887C5.39242 9.85049 5.37086 9.81015 5.35327 9.76768C5.33568 9.72522 5.3224 9.68145 5.31344 9.63637C5.30447 9.59129 5.29999 9.54577 5.29999 9.4998C5.29999 9.45384 5.30447 9.40832 5.31344 9.36324C5.3224 9.31816 5.33568 9.27439 5.35327 9.23193C5.37086 9.18946 5.39242 9.14912 5.41796 9.11091C5.44349 9.07269 5.47251 9.03733 5.50501 9.00483C5.53751 8.97233 5.57287 8.94331 5.61109 8.91778C5.64931 8.89224 5.68965 8.87068 5.73211 8.85309C5.77457 8.8355 5.81835 8.82222 5.86342 8.81325C5.9085 8.80429 5.95402 8.7998 5.99999 8.7998Z" fill="currentColor"/>
                <path d="M11.495 16.4947L16.9949 10.9948C17.1263 10.8635 17.2 10.6855 17.2 10.4998C17.2 10.3142 17.1263 10.1361 16.995 10.0048C16.8637 9.87355 16.6857 9.7998 16.5 9.7998C16.3144 9.7998 16.1363 9.87355 16.005 10.0049L10.505 15.5048C10.5018 16.0305 10.5002 16.3589 10.5001 16.4899C10.4451 16.4372 10.4392 16.47 10.4496 16.5063C10.4321 16.5139 10.4431 16.527 10.4624 16.5376C10.4731 16.557 10.4862 16.568 10.4939 16.5504C10.5299 16.5606 10.5624 16.5546 10.5101 16.5C10.6412 16.4999 10.9695 16.4982 11.495 16.4947ZM10.5001 16.5C10.4743 16.5 10.4583 16.5024 10.4496 16.5063C10.4527 16.5172 10.4572 16.5284 10.4624 16.5376C10.4717 16.5428 10.4829 16.5473 10.4939 16.5504C10.4977 16.5416 10.5001 16.5257 10.5001 16.5ZM10.5001 16.5C10.5033 16.5 10.5067 16.5 10.5101 16.5C10.5085 16.4983 10.5068 16.4966 10.505 16.4948C10.5033 16.4931 10.5017 16.4915 10.5001 16.4899C10.5001 16.4934 10.5001 16.4968 10.5001 16.5Z" fill="currentColor"/>
              </svg>
              <u-text text="需求管理" class="app-side-bar-item-text"></u-text>
            </u-sidebar-item>
            <u-sidebar-item value="form" class="app-side-bar-item">
              <svg width="18" height="18" viewBox="0 0 18 18" fill="none" class="app-side-bar-item-icon" xmlns="http://www.w3.org/2000/svg">
                <path d="M7.58251 6.11164L8.99999 8.23786L10.4173 6.11184C10.4493 6.06389 10.4868 6.02024 10.5295 5.98151C10.5722 5.94278 10.6189 5.90982 10.6697 5.88263C10.7205 5.85544 10.7738 5.83484 10.8297 5.82083C10.8856 5.80681 10.9424 5.7998 11 5.7998C11.0459 5.7998 11.0915 5.80429 11.1365 5.81325C11.1816 5.82222 11.2254 5.8355 11.2679 5.85309C11.3103 5.87068 11.3507 5.89224 11.3889 5.91778C11.4271 5.94331 11.4625 5.97233 11.495 6.00483C11.5275 6.03733 11.5565 6.07269 11.582 6.11091C11.6076 6.14912 11.6291 6.18946 11.6467 6.23193C11.6643 6.27439 11.6776 6.31816 11.6865 6.36324C11.6955 6.40832 11.7 6.45384 11.7 6.4998C11.7 6.6411 11.6608 6.77053 11.5824 6.88809L9.58243 9.88809C9.53093 9.96533 9.46662 10.0298 9.3895 10.0814C9.31237 10.1331 9.22829 10.168 9.13727 10.1862C9.04625 10.2044 8.95521 10.2045 8.86415 10.1865C8.77308 10.1685 8.68893 10.1337 8.6117 10.0822C8.53404 10.0305 8.46932 9.96575 8.41755 9.88809L6.41763 6.88822C6.33926 6.77065 6.29999 6.6411 6.29999 6.4998C6.29999 6.45384 6.30447 6.40832 6.31344 6.36324C6.3224 6.31816 6.33568 6.27439 6.35327 6.23193C6.37086 6.18946 6.39242 6.14912 6.41796 6.11091C6.44349 6.07269 6.47251 6.03733 6.50501 6.00483C6.53751 5.97233 6.57287 5.94331 6.61109 5.91778C6.64931 5.89224 6.68965 5.87068 6.73211 5.85309C6.77457 5.8355 6.81835 5.82222 6.86342 5.81325C6.9085 5.80429 6.95402 5.7998 6.99999 5.7998C7.05761 5.7998 7.11436 5.80681 7.17025 5.82083C7.22614 5.83484 7.27949 5.85544 7.33029 5.88263C7.38109 5.90982 7.42782 5.94278 7.47049 5.98151C7.51315 6.02024 7.55054 6.06369 7.58251 6.11164Z" fill="currentColor"/>
                <path d="M11.1365 10.8133C11.0915 10.8043 11.0459 10.7998 11 10.7998H6.99999C6.95402 10.7998 6.9085 10.8043 6.86342 10.8133C6.81835 10.8222 6.77457 10.8355 6.73211 10.8531C6.68965 10.8707 6.64931 10.8922 6.61109 10.9178C6.57287 10.9433 6.53751 10.9723 6.50501 11.0048C6.47251 11.0373 6.44349 11.0727 6.41796 11.1109C6.39242 11.1491 6.37086 11.1895 6.35327 11.2319C6.33568 11.2744 6.3224 11.3182 6.31344 11.3632C6.30447 11.4083 6.29999 11.4538 6.29999 11.4998C6.29999 11.5458 6.30447 11.5913 6.31344 11.6364C6.3224 11.6814 6.33568 11.7252 6.35327 11.7677C6.37086 11.8101 6.39242 11.8505 6.41796 11.8887C6.44349 11.9269 6.47251 11.9623 6.50501 11.9948C6.53751 12.0273 6.57287 12.0563 6.61109 12.0818C6.64931 12.1074 6.68965 12.1289 6.73211 12.1465C6.77457 12.1641 6.81835 12.1774 6.86342 12.1864C6.9085 12.1953 6.95402 12.1998 6.99999 12.1998H11C11.0459 12.1998 11.0915 12.1953 11.1365 12.1864C11.1816 12.1774 11.2254 12.1641 11.2679 12.1465C11.3103 12.1289 11.3507 12.1074 11.3889 12.0818C11.4271 12.0563 11.4625 12.0273 11.495 11.9948C11.5275 11.9623 11.5565 11.9269 11.582 11.8887C11.6076 11.8505 11.6291 11.8101 11.6467 11.7677C11.6643 11.7252 11.6776 11.6814 11.6865 11.6364C11.6955 11.5913 11.7 11.5458 11.7 11.4998C11.7 11.4538 11.6955 11.4083 11.6865 11.3632C11.6776 11.3182 11.6643 11.2744 11.6467 11.2319C11.6291 11.1895 11.6076 11.1491 11.582 11.1109C11.5565 11.0727 11.5275 11.0373 11.495 11.0048C11.4625 10.9723 11.4271 10.9433 11.3889 10.9178C11.3507 10.8922 11.3103 10.8707 11.2679 10.8531C11.2254 10.8355 11.1816 10.8222 11.1365 10.8133Z" fill="currentColor"/>
                <path d="M5.00098 1.5C3.34408 1.5 2.00098 2.84315 2.00098 4.5V13.5C2.00098 15.1569 3.34408 16.5 5.00098 16.5H13.001C14.6578 16.5 16.001 15.1569 16.001 13.5V4.5C16.001 2.84315 14.6578 1.5 13.001 1.5H5.00098ZM5.00098 2.9H13.001C13.4428 2.9 13.8199 3.05621 14.1323 3.36863C14.4448 3.68105 14.601 4.05817 14.601 4.5V13.5C14.601 13.9418 14.4448 14.3189 14.1323 14.6314C13.8199 14.9438 13.4428 15.1 13.001 15.1H5.00098C4.55918 15.1 4.18204 14.9438 3.86958 14.6314C3.55718 14.3189 3.40098 13.9418 3.40098 13.5V4.5C3.40098 4.05817 3.55718 3.68105 3.86958 3.36863C4.18204 3.05621 4.55918 2.9 5.00098 2.9Z" fill="currentColor"/>
              </svg>
              <u-text text="版本管理" class="app-side-bar-item-text"></u-text>
            </u-sidebar-item>
            <u-sidebar-item value="form" class="app-side-bar-item">
              <svg width="18" height="18" viewBox="0 0 18 18" fill="none" class="app-side-bar-item-icon" xmlns="http://www.w3.org/2000/svg">
                <path d="M12.6467 7.26768C12.6112 7.35344 12.5606 7.42914 12.495 7.49478L8.99496 10.9948C8.96246 11.0273 8.9271 11.0563 8.88889 11.0818C8.85067 11.1074 8.81033 11.1289 8.76787 11.1465C8.7254 11.1641 8.68163 11.1774 8.63655 11.1864C8.59147 11.1953 8.54595 11.1998 8.49999 11.1998C8.45403 11.1998 8.40851 11.1953 8.36343 11.1864C8.31835 11.1774 8.27457 11.1641 8.23211 11.1465C8.18965 11.1289 8.14931 11.1074 8.11109 11.0818C8.07287 11.0563 8.03752 11.0273 8.00502 10.9948L6.00501 8.99477C5.93938 8.92914 5.88879 8.85345 5.85327 8.76768C5.81775 8.68192 5.79999 8.59263 5.79999 8.4998C5.79999 8.45384 5.80447 8.40832 5.81344 8.36324C5.8224 8.31816 5.83568 8.27439 5.85327 8.23192C5.87086 8.18946 5.89242 8.14913 5.91796 8.1109C5.94349 8.07269 5.97251 8.03733 6.00501 8.00483C6.03751 7.97233 6.07287 7.94331 6.11109 7.91778C6.14931 7.89224 6.18965 7.87068 6.23211 7.85309C6.27457 7.8355 6.31835 7.82222 6.36342 7.81325C6.4085 7.80429 6.45402 7.7998 6.49999 7.7998C6.59281 7.7998 6.68211 7.81757 6.76787 7.85309C6.85363 7.88861 6.92939 7.93925 6.99503 8.00489L8.49999 9.50985L11.505 6.50483C11.5707 6.43919 11.6463 6.38861 11.7321 6.35309C11.8179 6.31757 11.9072 6.2998 12 6.2998C12.0459 6.2998 12.0915 6.30429 12.1365 6.31325C12.1816 6.32222 12.2254 6.3355 12.2679 6.35309C12.3103 6.37068 12.3507 6.39224 12.3889 6.41778C12.4271 6.44331 12.4625 6.47233 12.495 6.50483C12.5275 6.53733 12.5565 6.57269 12.582 6.61091C12.6076 6.64912 12.6291 6.68946 12.6467 6.73193C12.6643 6.77439 12.6776 6.81816 12.6865 6.86324C12.6955 6.90832 12.7 6.95384 12.7 6.9998C12.7 7.09263 12.6822 7.18192 12.6467 7.26768Z" fill="currentColor"/>
                <path d="M2.00098 4.5C2.00098 2.84315 3.34408 1.5 5.00098 1.5H13.001C14.6578 1.5 16.001 2.84315 16.001 4.5V13.5C16.001 15.1569 14.6578 16.5 13.001 16.5H5.00098C3.34408 16.5 2.00098 15.1569 2.00098 13.5V4.5ZM3.86958 3.36863C3.55718 3.68105 3.40098 4.05817 3.40098 4.5V13.5C3.40098 13.9418 3.55718 14.3189 3.86958 14.6314C4.18204 14.9438 4.55918 15.1 5.00098 15.1H13.001C13.4428 15.1 13.8199 14.9438 14.1323 14.6314C14.4448 14.3189 14.601 13.9418 14.601 13.5V4.5C14.601 4.05817 14.4448 3.68105 14.1323 3.36863C13.8199 3.05621 13.4428 2.9 13.001 2.9H5.00098C4.55918 2.9 4.18204 3.05621 3.86958 3.36863Z" fill="currentColor"/>
              </svg>

              <u-text text="任务管理" class="app-side-bar-item-text"></u-text>
            </u-sidebar-item>
          </u-sidebar>
        </u-multi-layout-item>
        <u-multi-layout-item style="background-color: var(--background-color-body, #F0F3FA);">
          <slot></slot>
        </u-multi-layout-item>
      </u-multi-layout>
    </u-multi-layout-item>
  </u-multi-layout>
</template>

<script>
import AvatarDefault from './avatar-default.vue';

export default {
  components: {
    AvatarDefault,
  },
};
</script>

<style>
.app-nav-bar {
  --navbar-background: var(--background-color-default);
  --navbar-color: var(--color-base);
  --navbar-item-color: var(--color-base);
  --navbar-item-color-hover: var(--brand-primary);
  --navbar-item-color-selected: var(--brand-primary);
  border-bottom: 1px solid var(--border-color-base);
}

.app-nav-bar-item {
  font-weight: 500;
  margin-right: var(--space-medium) !important;
}

.app-logo {
  color: var(--brand-primary);
  vertical-align: middle;
  margin-left: var(--space-base);
  margin-right: var(--space-small) !important;
}

.app-title {
  font-weight: 500;
  color: var(--color-base);
}

.user-avatar {
  width: 36px;
  height: 36px;
  vertical-align: middle;
}

.user-name {
  display: inline-block;
  vertical-align: top;
  margin-left: var(--space-small);
  margin-right: var(--space-small);
}

.app-side-bar {
  --sidebar-item-background-selected: var(--brand-primary-lightest);
  --sidebar-item-icon-color-selected: var(--brand-primary);
  --sidebar-item-height: 40px;
  --sidebar-item-padding-left: calc(var(--space-small) + 4px);
  --sidebar-item-background: transparent;
  --sidebar-background: var(--background-color-default);
  padding: var(--space-base) var(--space-small);
}

.app-side-bar-item {
  --sidebar-item-color: var(--font-second-color);
  border-right: none !important;
  border-radius: var(--border-radius-medium) !important;
  margin-bottom: var(--space-mini) !important;
  position: relative;
}

.app-side-bar-item[selected]::before {
  content: '';
  position: absolute;
  top: 12px;
  left: 0;
  width: 4px;
  height: 16px;
  background-color: var(--brand-primary);
  border-radius: 4px;
}

.app-side-bar-item-icon {
  margin-right: var(--space-small);
  vertical-align: middle;
  display: inline-block;
  height: 40px;
  line-height: 40px;
  margin-top: -3px;
}

.app-side-bar-item-text {
  vertical-align: middle;
  display: inline-block;
  height: 40px;
  line-height: 40px;
  margin-top: -4px;
}

.app-side-bar-item[selected] .app-side-bar-item-text {
  color: var(--color-base);
  font-weight: 500;
}
</style>

